<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>角色分配--博客后台管理</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">

	<link rel="stylesheet" type="text/css" href="../../layui/css/layui.css">

</head>
<body class="childrenBody">
	<form class="layui-form">
		<div class="layui-form-item">
			<label class="layui-form-label">分配权限</label>
			<div class="layui-input-block">
				<div id="LAY-auth-tree-index"></div>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn" lay-submit="" lay-filter="submitForm">立即提交</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
		    </div>
		</div>

	</form>
	<script type="text/javascript" src="../../layui/layui.js"></script>

	<script type="text/javascript">
		layui.config({
			base: '../../js/',
		}).extend({
			authtree: 'authtree',
		});
		layui.use(['jquery', 'authtree', 'form','layer'], function(){
			var $ = layui.jquery;
			var authtree = layui.authtree;
			var form = layui.form();
			var layer = parent.layer === undefined ? layui.layer : parent.layer;
			var authorIds = [];

			//获取页面的roleId
			var roleId = location.href.substr(location.href.lastIndexOf("#")+1);
			$.ajax({
				url: '/author/selectAuthorByCurrentRole.do',
				data:{"roleId":roleId},
				dataType: 'json',
				success: function(data){
					// 渲染时传入渲染目标ID，树形结构数据（具体结构看样例，checked表示默认选中），以及input表单的名字
					authtree.render('#LAY-auth-tree-index', data.data.trees, {inputname: 'authorIds', layfilter: 'lay-check-auth', openall: true});

					// 监听自定义lay-filter选中状态，PS:layui现在不支持多次监听，所以扩展里边只能改变触发逻辑，然后引起了事件冒泡延迟的BUG，要是谁有好的建议可以反馈我
					form.on('checkbox(lay-check-auth)', function(data){
						// 注意这里：需要等待事件冒泡完成，不然获取叶子节点不准确。
						setTimeout(function(){
							// 获取选中的叶子节点
							authorIds = authtree.getLeaf('#LAY-auth-tree-index');
							console.log(authorIds);
						}, 100);
						return false;
					});

				}
			});

			form.on("submit(submitForm)",function(data){
				//弹出loading
				//console.log(data.field);
				var index = top.layer.msg('数据提交中，请稍候',{icon: 16,time:false,shade:0.8});
				var ids = authorIds.toString();
				$.get("/author/saveAuthorIntoCurrentRole.do?id="+roleId+"&ids="+ids,function(returnData){
					top.layer.close(index);
					top.layer.msg("分配成功！");
					layer.closeAll("iframe");
					//刷新父页面
					parent.location.reload();
				});
				return false;
			})
		});
	</script>
</body>
</html>